﻿<script src="~/vue/dist/vue.global.js"></script>
<link href="~/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/element-plus/dist/index.full.js"></script>
<script src="~/axios/dist/axios.js"></script>



<div id="app">

	@* <form id="recruitAction!saveEngageResume" name="fm" action="/HR_Fist/recruit/recruitAction!saveEngageResume" method="post" enctype="multipart/form-data"> *@
	<el-form name="humanfileForm" method="post" ref="ruleFormRef"
			 :model="ruleForm"
			 :rules="rules"
			 label-width="120px"
			 class="demo-ruleForm">
		<input type="hidden" name="engageResume.passCheckcomment" value="不通过" />
		<input type="hidden" name="engageResume.passPasscomment" value="不通过" />
		<input type="hidden" name="engageResume.checkStatus" value="false" />
		<table width="100%">
			<tr>
				<td>
					<font color="black">您正在做的业务是：人力资源--招聘管理--简历管理--简历复核 </font>

				</td>
			</tr>
			<tr>
				<td align="right">
					<el-radio-group v-model="add.CheckStatus" v-on:change="radio1()">
						<el-radio value="2">通过</el-radio>
						<el-radio value="3">不通过</el-radio>
					</el-radio-group>
					&nbsp;
					&nbsp;
					<el-button type="primary" v-on:click="submitForm">提交</el-button>
					<el-button v-on: click="resetForm">清除</el-button>
				</td>
			</tr>
		</table>
		<table width="100%" border="1" cellpadding=0 cellspacing=1
			   bordercolorlight=#848284 bordercolordark=#eeeeee
			   class="TABLE_STYLE1">
			<tr>
				<td class="TD_STYLE1">
					职位分类
				</td>
				<td class="TD_STYLE2">
					<el-select v-model="ruleForm.HumanMajorKind" disabled placeholder="请选择职位分类" value-key="HumanMajorKindId" v-on:change="Three" style="width: 100%">

					</el-select>
				</td>
				<td class="TD_STYLE1">
					职位名称
				</td>
				<td class="TD_STYLE2" width="20%">
					<el-select v-model="ruleForm.HumanMajor" disabled placeholder="请选择职位昵称" value-key="HumanMajorId" style="width: 100%">
					</el-select>
				</td>
				<td width="11%" class="TD_STYLE1">
					招聘类型
				</td>
				<td class="TD_STYLE2" colspan="2">
					<el-form-item prop="EngageType">
						<el-select v-model="ruleForm.EngageType" disabled placeholder="请选择招聘类型" class="right-aligned-input" style="width: 100%;">
							<el-option label="社会招聘" value="社会招聘"></el-option>
							<el-option label="校园招聘" value="校园招聘"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE2" rowspan="6" colspan="6">
					<el-form-item>
						<label :class="'avatar-label'" style="position:relative;right:-30px">
							<el-avatar :src="ruleForm.HumanPicture" :size="200" fit="cover"></el-avatar>
						</label>
						<!-- 添加的按钮 -->
						
					</el-form-item>

				</td>
			</tr>

			<tr>
				<td class="TD_STYLE1">
					姓名
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanName">
						<el-input v-model.number="ruleForm.HumanName" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					性别
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanSex">
						<el-select v-model="ruleForm.HumanSex" disabled placeholder="请选择性别" class="right-aligned-input" style="width: 100%;">
							<el-option label="男" value="男"></el-option>
							<el-option label="女" value="女"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					EMAIL
				</td>
				<td colspan="2" class="TD_STYLE2">
					<el-form-item prop="Email">
						<el-input v-model.number="ruleForm.Email" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
			</tr>
			<tr>
				<td class="TD_STYLE1">
					电话
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanTelephone">
						<el-input v-model.number="ruleForm.HumanTelephone" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					家庭电话
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanHomephone">
						<el-input v-model.number="ruleForm.HumanHomephone" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					手机
				</td>
				<td colspan="2" class="TD_STYLE2">
					<el-form-item prop="HumanMobilephone">
						<el-input v-model.number="ruleForm.HumanMobilephone" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
			</tr>
			<tr>
				<td class="TD_STYLE1">
					住址
				</td>
				<td colspan="3" class="TD_STYLE2">
					<el-form-item prop="HumanAddress">
						<el-input v-model.number="ruleForm.HumanAddress" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>

				<td class="TD_STYLE1">
					邮编
				</td>
				<td colspan="2" class="TD_STYLE2">
					<el-form-item prop="HumanEmail">
						<el-input v-model.number="ruleForm.HumanEmail" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
			</tr>

			<tr>
				<td class="TD_STYLE1">
					国籍
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanNationality">
						<el-select v-model="ruleForm.HumanNationality" disabled placeholder="请选择国籍" class="right-aligned-input" style="width: 100%;">
							<el-option label="中国" value="中国"></el-option>
							<el-option label="俄罗斯" value="俄罗斯"></el-option>
							<el-option label="韩国" value="韩国"></el-option>
							<el-option label="德国" value="德国"></el-option>
							<el-option label="美国" value="美国"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					出生地
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanBirthplace">
						<el-input v-model.number="ruleForm.HumanBirthplace" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					生日
				</td>
				<td width="13%" colspan="2" class="TD_STYLE2">
					<el-form-item prop="HumanBirthday">
						<div class="block">
							<span class="demonstration"></span>
							<el-date-picker disabled v-model="ruleForm.HumanBirthday"
											type="date"
											placeholder="请选择生日"
							@* :size="size" /> *@
											:size="'small'" />
						</div>
					</el-form-item>
				</td>

			</tr>
			<tr>
				<td width="11%" class="TD_STYLE1">
					民族
				</td>
				<td class="TD_STYLE2" width="14%">
					<el-form-item prop="HumanRace">
						<el-select v-model="ruleForm.HumanRace" disabled placeholder="请选择民族" class="right-aligned-input" style="width: 100%;">
							<el-option label="汉族" value="汉族"></el-option>
							<el-option label="回族" value="回族"></el-option>
							<el-option label="壮族" value="壮族"></el-option>
							<el-option label="藏族" value="藏族"></el-option>
							<el-option label="苗族" value="苗族"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					宗教信仰
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanReligion">
						<el-select v-model="ruleForm.HumanReligion" disabled placeholder="请选择宗教信仰" class="right-aligned-input" style="width: 100%;">
							<el-option label="无" value="无"></el-option>
							<el-option label="佛教" value="佛教"></el-option>
							<el-option label="道教" value="道教"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					政治面貌
				</td>
				<td class="TD_STYLE2" colspan="2">
					<el-form-item prop="HumanParty">
						<el-select v-model="ruleForm.HumanParty" disabled placeholder="请选择政治面貌" class="right-aligned-input" style="width: 100%;">
							<el-option label="党员" value="党员"></el-option>
							<el-option label="群众" value="群众"></el-option>
						</el-select>
					</el-form-item>
				</td>


			</tr>
			<tr>
				<td class="TD_STYLE1">
					身份证号码
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanIdcard">
						<el-input v-model.number="ruleForm.HumanIdcard" disabled disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					年龄
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanAge">
						<el-input v-model.number="ruleForm.HumanAge" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					毕业院校
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanCollege">
						<el-input v-model.number="ruleForm.HumanCollege" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>

				<td class="TD_STYLE1">
					学历
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanEducatedDegree">
						<el-select v-model="ruleForm.HumanEducatedDegree" disabled placeholder="请选择学历" class="right-aligned-input" style="width: 100%;">
							<el-option label="大专" value="大专"></el-option>
							<el-option label="本科" value="本科"></el-option>
						</el-select>
					</el-form-item>
				</td>

			</tr>
			<tr>
				<td class="TD_STYLE1">
					教育年限
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanEducatedYears">
						<el-select v-model="ruleForm.HumanEducatedYears" disabled placeholder="请选择教育年限" class="right-aligned-input" style="width: 100%;">
							<el-option label="12" value="12"></el-option>
							<el-option label="16" value="16"></el-option>
						</el-select>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					学历专业
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanEducatedMajor">
						<el-select v-model="ruleForm.HumanEducatedMajor" disabled placeholder="请选择学历专业" class="right-aligned-input" style="width: 100%;">
							<el-option label="生物工程" value="生物工程"></el-option>
							<el-option label="计算机" value="计算机"></el-option>
						</el-select>
					</el-form-item>
				</td>

				<td class="TD_STYLE1">
					薪酬要求
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="DemandSalaryStandard">
						<el-input v-model.number="ruleForm.DemandSalaryStandard" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					注册时间
				</td>
				<td class="TD_STYLE2">
					<el-input v-model="ruleForm.RegistTime" readonly class="right-aligned-input" style="width: 100%;" readonly></el-input>
				</td>

			</tr>
			<tr>

				<td class="TD_STYLE1">
					特长
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanSpeciality">
						<el-select v-model="ruleForm.HumanSpeciality" disabled placeholder="请选择特长" class="right-aligned-input" style="width: 100%;">
							<el-option label="数据库" value="数据库"></el-option>
							<el-option label="java" value="java"></el-option>
						</el-select>
					</el-form-item>

				</td>
				<td class="TD_STYLE1">
					爱好
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="HumanHobby">
						<el-select v-model="ruleForm.HumanHobby" disabled placeholder="请选择爱好" class="right-aligned-input" style="width: 100%;">
							<el-option label="篮球" value="篮球"></el-option>
							<el-option label="羽毛球" value="羽毛球"></el-option>
						</el-select>
					</el-form-item>

				</td>
				<td class="TD_STYLE1">
					推荐人
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="Checker">
						<el-input v-model.number="add.Checker" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
				<td class="TD_STYLE1">
					推荐时间
				</td>
				<td class="TD_STYLE2">
					<el-form-item prop="CheckTime">
						<el-input v-model.number="add.CheckTime" disabled class="right-aligned-input" style="width: 100%;"></el-input>
					</el-form-item>
				</td>
			</tr>
			<tr>
				<td class="TD_STYLE1">
					个人履历
				</td>
				<td colspan="7" class="TD_STYLE2">
					<el-form-item prop="HumanHistoryRecords">
						<el-input type="textarea" disabled v-model="ruleForm.HumanHistoryRecords" rows="2" cols="80" class="TEXTAREA_STYLE1"></el-input>
					</el-form-item>
				</td>
			</tr>

			<tr>
				<td class="TD_STYLE1">
					备注
				</td>
				<td colspan="7" class="TD_STYLE2">
					<el-form-item prop="Remark">
						<el-input type="textarea" disabled v-model="ruleForm.Remark" rows="2" cols="80" class="TEXTAREA_STYLE1"></el-input>
					</el-form-item>
				</td>
			</tr>

			<tr>
				<td class="TD_STYLE1">
					推荐意见
				</td>
				<td colspan="7" class="TD_STYLE2">
					<el-form-item prop="Recomandation">
						<el-input type="textarea" v-model="add.Recomandation" rows="2" cols="80" class="TEXTAREA_STYLE1" readonly></el-input>
					</el-form-item>
				</td>
			</tr>
		</table>


</div>
<script>
    const { ElNotification, ElAvatar, ElButton } = ElementPlus;
    window.userTrueName = '@ViewBag.UserTrueName'; // 将ViewBag的值赋给全局变量，方便Vue实例获取
    const { createApp, ref, reactive, computed, onMounted } = Vue;
    const { ElMessage } = ElementPlus
    //长富的代码


    const app = createApp({
        setup() {
			const add = reactive({
				ResId:"",//id
				Checker: window.userTrueName,//登记人
				CheckTime:"",//登记时间
				Recomandation:"",//推荐意见
				CheckStatus:"",//复核状态
				Status:false
			})
            const ruleForm = reactive({
                HumanMajorKind: {}, //职位分类,对象获取HumanMajorKindId，HumanMajorKindName
                HumanMajor: {},//职位昵称，对象获取HumanMajorId,HumanMajorName
                EngageType: "",//招聘类型
                HumanName: "",//姓名
                HumanSex: "",//性别
                Email: "",//邮箱
                HumanTelephone: "",//电话
                HumanHomephone: "",//家庭电话
                HumanMobilephone: "",//手机
                HumanAddress: "",//住址
                HumanEmail: "",//邮编
                HumanNationality: "",//国籍
                HumanBirthplace: "",//出生地
                HumanBirthday: "",//生日
                HumanRace: "",//民族
                HumanReligion: "",//宗教信仰
                HumanParty: "",//政治面貌
                HumanIdcard: "",//身份证
                HumanAge: "",//年龄
                HumanCollege: "",//毕业院校
                HumanEducatedDegree: "",//学历
                HumanEducatedYears: "",//教育年限
                HumanEducatedMajor: "",//学历专业
                DemandSalaryStandard: "",//薪资要求
                RegistTime: "",//登记时间
                HumanSpeciality: "",//特长
                HumanHobby: "",//爱好
                HumanHistoryRecords: "",//个人履历
                Remark: "",//备注
                HumanPicture: "",//头像

                // CheckStatus: "1",复核状态
                // Checker: "无",复核人姓名
            })
            fill();
			var timi = ref(null);
			const tick = () => {
				const now = new Date();
				add.CheckTime = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')} ${String(now.getHours()).padStart(2, '0')}:${String(now.getMinutes()).padStart(2, '0')}:${String(now.getSeconds()).padStart(2, '0')}`;
				setTimeout(tick, 1000);
			};
			onMounted(() => {
				tick();
				ruleForm.RegistTime = timi.value;
			});

			const time = ref(new Date().toISOString());
			setInterval(() => {
				time.value = new Date().toISOString();
			}, 1000);

            function fill() {
                axios.get("/ER/SelectId").then(res => {
					console.info(res.data)
					ruleForm.HumanMajorKind = res.data.humanMajorKindName;
					ruleForm.HumanMajor = res.data.hunmaMajorName;
					ruleForm.EngageType = res.data.engageType;
					ruleForm.HumanName = res.data.humanName;
					ruleForm.HumanSex = res.data.humanSex;
					ruleForm.Email = res.data.email;
					ruleForm.HumanHomephone = res.data.humanHomephone;
					ruleForm.HumanTelephone = res.data.humanTelephone;
					ruleForm.HumanMobilephone = res.data.humanMobilephone;
					ruleForm.HumanAddress = res.data.humanAddress;
					ruleForm.HumanEmail = res.data.humanEmail;
					ruleForm.HumanNationality = res.data.humanNationality;
					ruleForm.HumanBirthplace = res.data.humanBirthplace;
					ruleForm.HumanBirthday = res.data.humanBirthday;
					ruleForm.HumanRace = res.data.humanRace;
					ruleForm.HumanReligion = res.data.humanReligion;
					ruleForm.HumanParty = res.data.humanParty;
					ruleForm.HumanIdcard = res.data.humanIdcard;
					ruleForm.HumanAge = res.data.humanAge;
					ruleForm.HumanCollege = res.data.humanCollege;
					ruleForm.HumanEducatedDegree = res.data.humanEducatedDegree;
					ruleForm.HumanEducatedYears = res.data.humanEducatedYears;
					ruleForm.HumanEducatedMajor = res.data.humanEducatedMajor;
					ruleForm.DemandSalaryStandard = res.data.demandSalaryStandard;
					ruleForm.RegistTime = res.data.registTime;
					ruleForm.HumanSpeciality = res.data.humanSpeciality;
					ruleForm.HumanHobby = res.data.humanHobby;
					ruleForm.HumanHistoryRecords = res.data.humanHistoryRecords;
					ruleForm.Remark = res.data.remark;
					ruleForm.HumanPicture = res.data.humanPicture;
					add.ResId = res.data.resId;
                })
            }
			function submitForm(){
				console.info(add)
				axios.put("/ER/ERUpdate",{
					eRupdateDto:add
				},{
                                headers: {
                                    "Content-type": "application/x-www-form-urlencoded",
                                    //或其他格式
                                },
                            }).then(res=>{
					if(res.data>0){
						ElMessage({
                                type: 'success',
                                message: '提交成功！'
                            });
                        setInterval(()=>{
							window.location.href = "/ER/IndexJLCX"
						},1000)
					}else{
						ElMessage({
                                type: 'err',
                                message: '修改失败！'
                            });
					}
				}).catch(err=>{
					ElMessage({
                                type: 'err',
                                message: '/ER/ERUpdate报错！报错信息！'+err
                            });
				})
			}
			function radio1(){
				if (add.CheckStatus == 2){
					add.Recomandation = "通过"
				}else{
					add.Recomandation = "不通过"
				}
				
			}

            return {
                ruleForm,
				add,
				submitForm,
				timi,radio1
            };
        }
    }).use(ElementPlus).mount('#app');

</script>
<style type="text/css">
	.avatar-label {
		cursor: pointer;
		display: inline-block;
		margin-right: 20px; /* 调整此值以改变向左移动的距离 */
	}

	/* 设置所有表格行的高度 */
	.TD_STYLE1, .TD_STYLE2 {
		height: 40px; /* 设置您想要的高度 */
	}

	/* 确保 el-form-item 的内容垂直居中 */
	.el-form-item {
		margin: 0;
		height: 100%;
		display: flex;
		align-items: center; /* 垂直居中对齐 */
	}

	/* 调整 el-select 和其内部输入框的高度 */
	.el-select, .el-input__inner {
		height: 100%; /* 让选择器占据整个单元格高度 */
		line-height: normal; /* 防止文本被拉伸 */
	}

		/* 确保选项的内联元素在垂直方向上居中 */
		.el-select .el-input__inner {
			display: flex;
			align-items: center;
		}


	.el-select__wrapper {
		align-items: center;
		background-color: var(--el-fill-color-blank);
		border-radius: var(--el-border-radius-base);
		box-shadow: 0 0 0 1px var(--el-border-color) inset;
		box-sizing: border-box;
		cursor: pointer;
		display: flex;
		font-size: 14px;
		gap: 6px;
		line-height: 24px;
		min-height: 20px;
		padding: 4px 12px;
		position: relative;
		text-align: left;
		transition: var(--el-transition-duration);
	}




	.right-aligned-input {
		text-align: right;
		width: 20ch; /* 20 characters */
	}

	.el-input__inner, .el-select .el-input__inner {
		text-align: right;
		width: 20ch; /* 20 characters */
	}


	.TABLE_STYLE1 {
		width: 100%;
	}

	/*     .TD_STYLE1 {
					background-color: #f0f0f0;
					padding: 8px;
					font-weight: bold;
				} */

	.TD_STYLE2 {
		padding: 8px;
	}

	.TD_STYLE4 {
		line-height: 36px; /* 使标签高度与输入框一致 */
		vertical-align: middle;
		margin-left: 0;
		display: grid;
		place-items: center;
	}

	.el-form-item__content {
		margin-left: 0px !important;
	}
	/* 去除浏览器默认宽度 */
	body .container, body main {
		width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
		box-sizing: border-box !important;
		max-width: none !important;
	}

	body {
		font-size: 13px;
		background-color: #ffffcc;
	}

	.BUTTON_STYLE1 {
		BORDER-RIGHT: #2C59AA 1px solid;
		PADDING-RIGHT: 2px;
		BORDER-TOP: #2C59AA 1px solid;
		PADDING-LEFT: 2px;
		FONT-SIZE: 12px;
		background: linear-gradient(to bottom, #ffffff, #C3DAF5);
		BORDER-LEFT: #2C59AA 1px solid;
		CURSOR: pointer;
		COLOR: black;
		PADDING-TOP: 2px;
		BORDER-BOTTOM: #2C59AA 1px solid
	}

	.TABLE_STYLE1 {
		border: 1px solid;
		border-color: #000000;
		border-collapse: collapse;
		width: 100%;
	}

	.TD_STYLE1 {
		background-color: #FFDB6F;
		border-width: 1px;
	}

	.TD_STYLE2 {
		border-spacing: 1px;
		background-color: #FFFFBB;
		border-color: #DEDBD6;
		border: 0;
	}

	.INPUT_STYLE1 {
		BACKGROUND-COLOR: #FFFFCC;
		width: 30%
	}

	.TEXTAREA_STYLE1 {
		BACKGROUND-COLOR: #FFFFCC;
		width: 100%;
	}

	table:nth-of-type(2) {
		border: 1px solid black;
		border-collapse: collapse;
	}

		table:nth-of-type(2) td {
			border: 1px solid black;
		}

</style>